<template>
  <div style="height: 100%; background-color: #ffffff;">
    <CardList ref="cardList"></CardList>
    <CustomForm ref="customForm"></CustomForm>
    <ImageList :isValid="false" ref="imageList"></ImageList>
    <a-row :gutter="[8, 8]" style="background-color: #ffffff; padding: 24px;">
      <a-col :span="24" style="text-align: center;">
        <a-button type="primary" @click="submitHandle" style="width: 240px;">
          提交
        </a-button>
      </a-col>
    </a-row>
  </div>
</template>

<script>
import { initUserInfo } from "@/unit/tool";
import CardList from "./components/cardList";
import ImageList from "./components/imageList";
import CustomForm from "./components/customForm";
import api from "@/server/userConfig";

function formatPictureIds(lists) {
  let idLists = [];
  if (lists.length > 0) {
    lists.forEach((item, index) => {
      idLists.push(item.uid);
    });
    return idLists;
  } else {
    return [];
  }
}

function formatAssignUsername(str) {
  return str.split(",");
}

export default {
  name: "NewProductRepair",
  components: {
    CardList,
    ImageList,
    CustomForm
  },
  computed: {},
  data() {
    return {
      userName: "",
      name: "",
      role: "",
      compId: ""
    };
  },

  methods: {
    async submitHandle() {
      let cardListValid = await this.$refs.cardList.getFormData();
      let imageListValid = await this.$refs.imageList.getFormData();
      let customFormValid = await this.$refs.customForm.getFormData();
      if (
        cardListValid.isValid &&
        imageListValid.isValid &&
        customFormValid.isValid
      ) {
        let repairBases = cardListValid.data;
        let pictureIds = formatPictureIds(imageListValid.data);
        let customFormData = customFormValid.data;
        let { assignUsername, ...restCustomFormData } = customFormData;
        let assignUsernameAry = formatAssignUsername(assignUsername);

        let params = {
          repairBases,
          pictureIds,
          ...customFormData,
          assignUsername: assignUsernameAry[1],
          assignOperator: assignUsernameAry[0],
          username: this.userName,
          operator: this.name
        };

        let res = await api.repairAddRepair(params);
        if (res.msgCode === 0) {
          this.$message.success("产品返修单创建成功");
          this.$router.push("/productRepair");
        } else {
          this.$message.error(res.msgDesc);
        }
      }
    }
  },
  created() {
    initUserInfo(this);
  },
  mounted() {}
};
</script>

<style scoped="scoped">
@import "./components/style.css";
</style>
